<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ page session="true"%>
<!DOCTYPE html>
<!--[if IE 7]>
<html id="ie7">
<![endif]-->
<!--[if IE 8]>
<html id="ie8">
<![endif]-->
<!--[if IE 9]>
<html id="ie9">
<![endif]-->
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name='viewport'
	content='width=device-width, initial-scale=1.0, user-scalable=no'>
<title>지역정보설정-장소기준</title>
<!-- Replace favicon.ico & apple-touch-icon.png in the root of your domain and delete these references -->
<link rel='shortcut icon' href='./resources/img/favicon.png' />
<!--[if IE 8]><link rel='stylesheet' type='text/css' href='./../css/ie8.css' /><![endif]-->
<!-- Theme Hook -->

<link rel='stylesheet' id='style-css' href='./resources/css/style.css' type='text/css' media='all' />
<link rel='stylesheet' id='demo_panel-css' href='./resources/css/side_panel.css' type='text/css' media='all' />
<!--사이드바를 위해 추가-->
<link rel='stylesheet' id='miniColors-css' href='./resources/css/jquery.miniColors.css' type='text/css' media='all' />
<link rel='stylesheet' id='responsive-style-css' href='./resources/css/responsive.css' type='text/css' media='all' />
<link rel='stylesheet' id='light_skin-css' href='./resources/css/light_skin.css' type='text/css' media='all' />
<link rel='stylesheet' id='skin13-css' href='./resources/css/darkallstar.css' type='text/css' media='all' />
<link rel='stylesheet' id='options-css' href='./resources/css/options.css' type='text/css' media='all' />
<link rel='stylesheet' id='bootstrap-css' href='./resources/css/bootstrap.css' type='text/css' media='all' />
<link rel='stylesheet' id='google-webfonts-css' href='http://fonts.googleapis.com/css?family=Averia+Libre:400,700' type='text/css' media='all' />
<link rel="stylesheet" type="text/css" href="./resources/css/anytime.css" />
<!--[if lt IE 9]><script src='./../js/html5shiv.js'></script><![endif]-->

<script type='text/javascript' src='./resources/js/jquery.js'></script>
<script type='text/javascript' src='./resources/js/demo_panel.js'></script>
<!--사이드바를 위해 추가-->
<script type='text/javascript'
	src='./resources/js/jquery.minicolors.js'></script>
<script type='text/javascript' src='./resources/js/bootstrap.js'></script>

<!--timepicker추가-->
<script src="./resources/js/jquery-ui-1.10.3.custom.js"></script>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="./resources/js/anytime.js"></script>
<script src="./resources/js/anytimez.js"></script>
<!-- <script type="text/javascript" src="./resources/js/polygon_loc.js"></script> -->
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>

<script type="text/javascript">
	var shape;
	var geocoder;
	var map;
	function initialize() {
	  geocoder = new google.maps.Geocoder();
	  var latlng = new google.maps.LatLng(37.56641923090,126.9778741551);
	  var mapOptions = {
	    zoom: 18,
	    center: latlng,
	    mapTypeId: google.maps.MapTypeId.ROADMAP
	  };
	  map = new google.maps.Map(document.getElementById("GoogleMap_map"), mapOptions);
		 
		 var shape = new google.maps.Polygon({
	         strokeColor: '#ff0000',
	         strokeOpacity: 0.8,
	         strokeWeight: 1,
	         fillColor: '#ff0000',
	         fillOpacity: 0.35
	       });
		 shape.setMap(map);
		 google.maps.event.addListener(map, 'click', addPoint);
	     function addPoint(e) {
	         var vertices = shape.getPath();      
	         vertices.push(e.latLng);
	       }
	} 
	
     function codeAddress() {
    	  var address = document.getElementById('address').value;
    	  geocoder.geocode( { 'address': address}, function(results, status) {
    	    if (status == google.maps.GeocoderStatus.OK) {
    	      map.setCenter(results[0].geometry.location);
    	      var marker = new google.maps.Marker({
    	          map: map,
    	          position: results[0].geometry.location
    	      });
    	    } else {
    	      alert('입력하신 지역을 찾을 수 없습니다. ' + status);
    	    }
    	  });
    	};
    	google.maps.event.addDomListener(window, 'load', initialize);	

</script>
</head>
<body >
	<!--<div id="top"></div>-->
	<!-- Demo Panel -->
	<div id="options_panel" class="">
		<div class="options">
			<table>
				<tr class="demo_title">
					<td><h4>특정-지역</h4></td>
				</tr>
				<tr class="demo_title">
					<td><h5>아이의 알림을 받을 특정 장소를 설정하세요.</h5></td>
				</tr>
				<tr>
					<td>
						<form class="form-inline">
							<fieldset>
								<table>
									<tr>
										<td class="control-group form-horizontal"><label
											class="control-label custom-label">자녀선택</label>
											<div class="controls">
												<select id="selectbasic" name="selectbasic"
													class="input-medium" required>
													<option>자녀1</option>
													<option>자녀2</option>
													<option>자녀3</option>
												</select>
											</div></td>
									</tr>
									<tr class="">
										<td class="control-group form-horizontal"><label
											class="control-label custom-label">설정이름</label>
											<div class="controls setting_name">
												<input name="text" class="input-small"
													placeholder="설정이름을 입력하세요." type="text" required>
											</div> <!--  <p class="help-block">help</p> --></td>
									</tr>
									<tr class="">
										<td class="control-group  form-horizontal"><label
											class="control-label custom-label">지역설정</label>
											<div class="controls">
												<div class="input-append">
													<input id="appendedtext" name="appendedtext"
														class="input-medium" placeholder="동 이름으로 검색" type="text"
														required> <span class="btn"
														style="padding: 4px 3px;">검색</span>
												</div>
											</div></td>
									</tr>
									<tr class="">
										<!-- <td class="control-group form-horizontal"><label class="control-label custom-label">반경설정</label>
										<div class="controls">
											<select id="selectbasic2" name="selectbasic" class="input-medium" required>
												<option>10M</option>
												<option>20M</option>
												<option>30M</option>
												<option>50M</option>
												<option>100M</option>
												<option>150M</option>
												<option>200M</option>
												<option>250M</option>
												<option>300M</option>
												<option>500M</option>
											</select>
										</div></td> -->
									</tr>
									<tr class="demo_title">
										<td class="right">
											<button type="submit" class="btn btn-success">
												<a>&nbsp;등 록&nbsp;</a>
											</button>
											<button type="button" class="btn">취 소</button>&nbsp;&nbsp;&nbsp;
										</td>
									</tr>
								</table>
							</fieldset>
						</form>
					</td>
				</tr>
			</table>
		</div>
		<h3>
			<span class="icon-wrench icon-white"></span>
		</h3>
	</div>
	<!-- Demo Panel End -->
	<!-- Header -->
	<article id="header_nav">
		<div class="wrap_top_icon">
			<div class="container">
				<div class="mobile-navigation visible-tablet">
					<a id="tablet_menu" href="#"></a>
					<ul>
						<div class="triangle"></div>
						<li><a class="text" href="#top">홈</a></li>
						<li><a class="text" href="#about">위키미소개</a></li>
						<li><a class="text" href="#location">i-위치확인</a></li>
						<li><a class="text" href="#danger">위험지역신고</a></li>
						<li><a class="text" href="#set">환경설정</a></li>
						<li><a class="text" href="#search">조회</a></li>
						<li><a class="text" href="#stats">통계</a></li>
					</ul>
				</div>
			</div>
		</div>
		<div class="wrap wrap_header">
			<div class="container">
				<header class="clearfix">
					<a id="top_button" href="#top"></a>
					<!-- Logo -->
					<div id="top_logo">
						<a class="logo" href="#top"> <img
							src="./resources/img/wiwi.PNG" alt="Logo" />
						</a>
					</div>
					<!--End Logo -->
					<div class="official">
						<!-- sticky navigation - Official menu -->
						<ul class="localscroll visible-desktop sticky_navigation">
							<li><a class="home" href="#top"> <span class="text">홈</span>
									<div class="bottom_border"></div>
							</a></li>
							<li><a class="about" href="#about"> <span class="text">위키미소개</span>
									<div class="bottom_border"></div>
							</a></li>
							<li><a class="location" href="#location"> <span
									class="text">i-위치확인</span>
									<div class="bottom_border"></div>
							</a></li>
							<li><a class="danger" href="#danger"> <span class="text">위험지역신고</span>
									<div class="bottom_border"></div>
							</a></li>
							<li><a class="set" href="#set"> <span class="text">환경설정</span>
									<div class="bottom_border"></div>
							</a></li>
							<li><a class="search" href="#search"> <span class="text">조회</span>
									<div class="bottom_border"></div>
							</a></li>
							<li><a class="stats" href="#stats"> <span class="text">통계</span>
									<div class="bottom_border"></div>
							</a></li>
						</ul>
						<!-- End sticky navigation - Official menu -->
					</div>
					<div class="mobile-navigation visible-phone">
						<a id="phone_menu" href="#"></a>
						<ul>
							<div class="triangle"></div>
							<li><a class="text" href="#top">홈</a></li>
							<li><a class="text" href="#about">위키미소개</a></li>
							<li><a class="text" href="#location">i-위치확인</a></li>
							<li><a class="text" href="#danger">위험지역신고</a></li>
							<li><a class="text" href="#set">환경설정</a></li>
							<li><a class="text" href="#search">조회</a></li>
							<li><a class="text" href="#stats">통계</a></li>
						</ul>
					</div>
				</header>
			</div>
		</div>
		<!-- 서브메뉴 -->
		<div class="wrap wrap_primary_navigation">
			<div class="container">
				<div class="primary_navigation">
					<ul id="menu-menu" class="visible-desktop">
						<li id="menu-item-90"
							class="menu-item menu-item-type-custom menu-item-object-custom">
							<a href="#">시간-지역</a>
							<div class="clearfix"></div>
						</li>
						<li id="menu-item-87"
							class="menu-item menu-item-type-custom menu-item-object-custom">
							<a href="#">특정지역</a>
							<div class="clearfix"></div>
						</li>
						<li id="menu-item-82"
							class="menu-item menu-item-type-custom menu-item-object-custom"
							style="float: right;">
							<%
								String login = (String) session.getAttribute("userName");
								if (login != null) {
							%> <%-- <%= session.getAttribute("userName")%> --%> <a
							class="text" href="<%=request.getContextPath()%>/login/logout">로그아웃</a>
							<%
								} else {
							%> <a class="text" href="<%=request.getContextPath()%>#login"
							data-toggle="modal">로그인</a> <%
 	}
 %>
							<div class="clearfix"></div>
						</li>

						<li id="menu-item-81"
							class="menu-item menu-item-type-custom menu-item-object-custom"
							style="float: right;"><a href="#">회원정보</a>
							<div class="clearfix"></div></li>
						<li id="menu-item-80"
							class="menu-item menu-item-type-custom menu-item-object-custom"
							style="float: right;"><a href="#">커뮤니티</a>
							<div class="clearfix"></div></li>
					</ul>
				</div>
			</div>
			<!-- 서브메뉴를 접기 위해 추가 -->
			<div class="submobile-navigation visible-phone">
				<a id="iphone_menu" href="#"></a>
				<ul>
					<div class="triangle"></div>
					<li><a class="text" href="#about">시간-지역</a></li>
					<li><a class="text" href="#about">특정지역</a></li>
					<li>
						<%
							String loginP = (String) session.getAttribute("userName");
							if (loginP != null) {
						%> <%-- <%= session.getAttribute("userName")%> --%> <a
						class="text" href="<%=request.getContextPath()%>/login/logout">로그아웃</a>
						<%
							} else {
						%> <a class="text" href="<%=request.getContextPath()%>#login"
						data-toggle="modal">로그인</a> <%
 	}
 %>
					</li>
					<li><a class="text" href="#about">회원정보</a></li>
					<li><a class="text" href="#about">커뮤니티</a></li>

				</ul>
			</div>
			<div class="submobile-navigation visible-tablet">
				<a id="itablet_menu" href="#"></a>
				<ul>
					<div class="triangle"></div>
					<li><a class="text" href="#about">시간지역</a></li>
					<li><a class="text" href="#about">특정지역</a></li>
					<li>
						<%
							String loginT = (String) session.getAttribute("userName");
							if (loginT != null) {
						%> <%-- <%= session.getAttribute("userName")%> --%> <a
						href="<%=request.getContextPath()%>/login/logout">로그아웃</a> <%
 	} else {
 %> <a href="<%=request.getContextPath()%>#login" data-toggle="modal">로그인</a>
						<%
							}
						%>
					</li>
					<li><a class="text" href="#about">회원정보</a></li>
					<li><a class="text" href="#about">커뮤니티</a></li>
				</ul>
			</div>
			<!-- 서브메뉴를 접기위해 추가 -->
		</div>
	</article>
	<!-- Header End -->

	<!--Modal-->
	<%-- <jsp:include page="./login/mem_login.jsp"></jsp:include> --%>
	<!--Modal-->

	<!-- map -->
	<article id="wmap" class="Portfolio">
		<div class="wrap wrap_space_primary_menu"></div>
		<div class="wrap">
			<div class="container">
				<header class="row visible-desktop">
					<div class="span12 wrap_sub_title">
						<span class="text">지도에서 위치를 선택하세요</span>
					</div>
				</header>
				<header class="row visible-tablet">
					<div class="span12 wrap_sub_title">
						<span class="text">지도에서 위치를 선택하세요</span>
					</div>
				</header>
				<header class="row visible-phone">
					<div class="span12 wrap_sub_title">
						<span class="text">지도에서 위치를 선택하세요</span>
					</div>
				</header>
				<div class="row">
					<div id="GoogleMap_map" class="span12 wrap_form" style="height: 450px">
						<!-- <img src="http://openapi.naver.com/map/getStaticMap?version=1.0&crs=EPSG:4326&center=126.976901,37.571607&level=10&w=2000&h=400&maptype=default&key=37fd2c0ae340d63cc596097644148c2c&uri=localhost:5427/Projects/naverMap.htm"/> -->
					</div>
				</div>
				<div id="bottom">
					<input id="reset" value="초기화" type="button"/> 
					<input id="showData" value="지역정보생성" type="button"/>

				</div>
				<div id="bottom1">
				<%-- <form action="#" onsubmit="showAddress(this.address.value); return false"> --%>
					 <input id="address" type="text" value="" name="address" >
          			 <input type="button" value="Enter" onclick="codeAddress()">
          		<%-- </form> --%>
				</div>
			</div>
		</div>
	</article>
	<!-- home End -->

	<!-- Blog -->
	<article id="blog"></article>
	<!-- End Blog -->

	<!-- location -->
	<article>
		<div class="wrap location_height">
			<div id="location" class="rotated_line rotated_line_location6"></div>
			<div class="contact_map"></div>
			<div class="rotated_line  rotated_line_location5"></div>
		</div>
	</article>
	<!-- End location -->

	<!-- contact -->
	<article id="contact"></article>
	<!-- End contact -->

	<!-- Topbar -->
	<article class="hidden-phone" id="topbar">
		<div class="wrap wrap_topbar">
			<div class="container"></div>
		</div>
	</article>

	<article class="visible-phone topbar_phone">
		<div class="wrap wrap_topbar">
			<div class="container"></div>
		</div>
	</article>
	<!-- End Topbar -->
	<!-- footer -->
	<div class="wrap wrap_space_primary_menu"></div>
	<footer>
		<div class="wrap wrap_footer">
			<div class="container">
				<p class="centerfooter" align="center">&copy; 여기는 footer입니다. by
					wikimi</p>
			</div>
		</div>
	</footer>
	<!-- footer End-->
	<!-- **********   Theme Hook   ********** -->
	<script type='text/javascript' src='./../resources/js/superfish.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.parallax-1.1.3.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.isotope.min.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.flexslider-min.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.magnific-popup.min.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.cycle.lite.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.cycle2.swipe.min.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.nicescroll.min.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.idTabs.min.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.easing.1.3.js'></script>
	<script type='text/javascript' src='./../resources/js/audio.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.prettyPhoto.js'></script>
	<script type='text/javascript' src='./../resources/js/widgets.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.touch-slider.1.0.2.min.js'></script>
	<script type='text/javascript'>
		/* <![CDATA[ */
		var slider_settings = {
			"delay" : "5000",
			"itemInSpeed" : "500",
			"itemOutSpeed" : "1500",
			"bgSpeed" : "700"
		};
		/* ]]> */
	</script>
	<script type='text/javascript'
		src='./../resources/js/jquery.awesome-slider.1.0.2.min.js'></script>
	<script type='text/javascript'
		src='./../resources/js/jquery.gmap-2.1.2-min.js'></script>
	<script type='text/javascript'>
		/* <![CDATA[ */
		var theme_uri = {
			"img" : ".\/..\/resources\/img"
		};
		var theme_strings = {
			"contact_submit" : "Send"
		};
		var red_sky_scroll = {
			"scrolling_speed" : "1000",
			"scrolling_easing" : "easeInOutSine",
			"scrolling_hash" : ""
		};
		var red_sky_about_parallax = {
			"about_parallax_speed" : "0.1",
			"about_parallax_position" : "50"
		};
		var red_sky_portfolio_parallax = {
			"portfolio_parallax_speed" : "0.1",
			"portfolio_parallax_position" : "50"
		};
		var red_sky_blog_parallax = {
			"blog_parallax_speed" : "0.1",
			"blog_parallax_position" : "50"
		};
		var paged_data = {
			"startPage" : "1",
			"maxPages" : "1",
			"nextLink" : null,
			"loadingText" : "Loading...",
			"loadMoreText" : "Load More",
			"noMorePostsText" : "No More Posts"
		};
		var portfolio_data = {
			"startPage" : "1",
			"maxPages" : "2",
			"nextLink" : "?paged=2",
			"loadingText" : "Loading...",
			"loadMoreText" : "Load More",
			"noMorePostsText" : "No More Posts"
		};
		/* ]]> */
	</script>
	<script type='text/javascript' src='./../resources/js/custom.js'></script>

</body>

</html>